<template>
  <div class="app-container">
    <div class="list">
      <div class="item" v-for="(item,index) in list" :key="index">
        <span class="item-content">
          <img v-if="regR(item.fileList[0].filePath) == '.epub'" src="/static/images/personal/shared_epub_icon.png" alt="">
          <img v-else-if="regR(item.fileList[0].filePath) == '.doc'" src="/static/images/personal/shared_doc_icon.png" alt="">
          <img v-else-if="regR(item.fileList[0].filePath) == '.xls'"  src="/static/images/personal/shared_xls_icon.png" alt="">
          <img v-else  src="/static/images/personal/download.png" alt="">
          <!-- <div>{{regR(item.fileList[0].filePath)}}</div> -->
          <div class="item-center">
            <span class="name" v-html="item.bookName">读书笔记规范</span>
            <span class="down" @click="goToInfo(item)">在线打开</span>
          </div>
          <span class="item-time">2018年9月30 16:05</span>
        </span>

      </div>
    </div>
  </div>
</template>

<script>
import { getOrgResByOrgIdAndResType } from "@/api/index";
export default {
  data() {
    return {
      list: []
    };
  },
  components: {},
  created() {
    this.init();
  },
  methods: {
    goToInfo(item) {
      const type = this.regR(item.fileList[0].filePath)
      const url =  item.fileList[0].filePath
       if(type == '.epub'){
         this.$router.push("/book/content?url=" + url+"&bookName="+item.bookName);
       }else{
         this.$router.push("/book/pdf?url=" +url+"&bookName="+item.bookName);
       }
    },
    regR(url) {
      let d = /\.[^\.]+$/.exec(url)
      return d[0]
    },
    openWindow(item) {
      window.open(item.fileList[0].filePath);
    },
    init() {
      getOrgResByOrgIdAndResType().then(res => {
        console.log(res.data.data);
        this.list = res.data.data;
      });
    }
  }
};
</script>
<style lang="less" scoped>
.list {
  .item {
    padding: 10px 0 24px 0;
    border-bottom: 1px solid #eaeaea;
    span {
      display: block;
    }
    .item-content>div:first-child{
      width: 100px;
      text-align: center;
      line-height: 48px

    }
    .item-content {
      font-size: 18px;
      display: flex;
      .item-center {
        display: flex;
        flex-direction: column;
        justify-content: center;
        margin-left: 30px;
        flex: 1;
        .down {
          color: #14d181;
          cursor: pointer;
        }
      }
    }
    .item-time {
      text-align: right;
      font-size: 16px;
      color: #a1a1a1;
    }
  }
}
</style>


